<!--********************************************************************
* Copyright© 2000 - 2025 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title data-i18n="resources.title_bufferAnalystServiceGeometry_FGB"></title>
    <script type="text/javascript" src="../js/include-web.js"></script>
    <script type="text/javascript" src="../../dist/ol/include-ol.js"></script>
  </head>
  <body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
    <div id="map" style="width: 100%; height: 100%"></div>
    <script type="text/javascript">
      var map,
        options,
        baseUrl =
          (window.isLocal ? window.server : 'https://iserver.supermap.io') +
          '/iserver/services/map-changchun/rest/maps/长春市区图',
        serviceUrl =
          (window.isLocal ? window.server : 'https://iserver.supermap.io') +
          '/iserver/services/spatialanalyst-changchun/restjsr/spatialanalyst';
      var extent = [48.4, -7668.25, 8958.85, -55.58];
      var projection = new ol.proj.Projection({
        code: '',
        extent: extent,
        units: 'm'
      });
      new ol.supermap.MapService(baseUrl).getMapInfo().then(function (serviceResult) {
        var mapJSONObj = serviceResult.result;
        map = new ol.Map({
          target: 'map',
          // ol v7版本用法为ol.control.defaults.defaults； v6版本以下用法为ol.control.defaults
          controls: ol.control.defaults.defaults({ attributionOptions: { collapsed: false } })
            .extend([new ol.supermap.control.Logo({ link: "https://iclient.supermap.io" })]),
          view: new ol.View({
            center: [5100, -3861.911472192499],
            zoom: 2,
            projection: projection,
            multiWorld: true
          })
        });
        options = ol.source.TileSuperMapRest.optionsFromMapJSON(baseUrl, mapJSONObj);
        var layer = new ol.layer.Tile({
          source: new ol.source.TileSuperMapRest(options)
        });
        map.addLayer(layer);
        geoBufferAnalystProcess();
      });

      function geoBufferAnalystProcess() {
        var pointsList = [
          [2823.94, -4690.0],
          [3448.94, -4690.301],
          [3816.561, -3810.125],
          [3917.383, -3609.158],
          [3976.983, -3490.291],
          [4020.004, -4377.027],
          [4076.265, -4382.939],
          [4215.049, -4382.333],
          [4428.156, -4382.285],
          [4647.579, -4383.017],
          [4679.707, -4382.898],
          [4917.462, -4382.635],
          [5074.019, -4381.833],
          [5257.042, -4381.031],
          [5363.785, -4380.717],
          [5671.717, -4378.794],
          [5847.521, -4377.97],
          [5990.637, -4303.528],
          [6055.343, -4270.072],
          [6168.913, -4382.389],
          [6214.183, -4209.927],
          [6377.789, -4209.142],
          [6393.692, -4210.142],
          [6693.989, -4207.45],
          [6788.392, -4208.45],
          [6984.304, -4207.21],
          [7189.183, -4208.296],
          [7300.505, -4208.296],
          [7573.056, -4208.803],
          [7680.977, -4208.804],
          [7850.593, -4208.393],
          [8182.656, -4210.533],
          [8554.893, -4261.485]
        ];
        //在所有离散gps信号点添加到地图上
        for (i = 0; i < pointsList.length; i++) {
          var point = new ol.Feature({
            geometry: new ol.geom.Point(pointsList[i])
          });
          var pointLayer = new ol.layer.Vector({
            source: new ol.source.Vector({
              features: [point]
            }),
            style: new ol.style.Style({
              image: new ol.style.Circle({
                radius: 4,
                fill: new ol.style.Fill({
                  color: 'black'
                })
              })
            })
          });
          map.addLayer(pointLayer);
        }
        //将由离散gps信号点生成的线路添加到地图上
        var roadLine = new ol.geom.LineString(pointsList);
        var roadLineSource = new ol.source.Vector({
          features: [new ol.Feature(roadLine)]
        });
        var roadLineLayer = new ol.layer.Vector({
          source: roadLineSource,
          style: new ol.style.Style({
            stroke: new ol.style.Stroke({
              color: 'red',
              width: 3
            })
          })
        });
        map.addLayer(roadLineLayer);
        //创建缓冲区分析服务参数
        geoBufferAnalystParams = new ol.supermap.GeometryBufferAnalystParameters({
          sourceGeometry: roadLine,
          bufferSetting: new ol.supermap.BufferSetting({
            endType: ol.supermap.BufferEndType.ROUND,
            leftDistance: new ol.supermap.BufferDistance({ value: 250 }),
            rightDistance: new ol.supermap.BufferDistance({ value: 250 }),
            semicircleLineSegment: 10
          })
        });
        var geoBufferAnalystParams1 = new ol.supermap.GeometryBufferAnalystParameters({
          sourceGeometry: roadLine,
          bufferSetting: new ol.supermap.BufferSetting({
            endType: ol.supermap.BufferEndType.ROUND,
            leftDistance: new ol.supermap.BufferDistance({ value: 250 }),
            rightDistance: new ol.supermap.BufferDistance({ value: 250 }),
            semicircleLineSegment: 10
          })
        });
        // 向iServer发送请求并返回结果
        var spatialAnalystService =  new ol.supermap.SpatialAnalystService(serviceUrl);
        spatialAnalystService.bufferAnalysis(
          geoBufferAnalystParams1,
          'FGB'
        ).then(function (serviceResult) {
            const vectorSource = new ol.source.FGB({
              url: serviceResult.result.newResourceLocation,
              strategy: ol.loadingstrategy.all
            });

            resultLayer = new ol.layer.Vector({
              source: vectorSource,
              style: new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: 'blue',
                  width: 1
                }),
                fill: new ol.style.Fill({
                  color: 'rgba(255, 0, 0, 0.1)'
                })
              })
            });
            map.addLayer(resultLayer);
          },
        );

        spatialAnalystService.bufferAnalysis(
          geoBufferAnalystParams
        ).then(function (serviceResult) {
            //将组成缓冲区的边界点提出来，为了构造下面查询服务的geometry
            var bufferPoints = [];
            var coordinate = serviceResult.result.resultGeometry.geometry.coordinates[0][0];
            for (var i = 0; i < coordinate.length; i++) {
              bufferPoints.push([coordinate[i][0], coordinate[i][1]]);
            }
            var geometry = new ol.geom.Polygon([bufferPoints]);
            queryByGeometryParameters = new ol.supermap.QueryByGeometryParameters({
              queryParams: [new ol.supermap.FilterParameter({ name: 'Company@Changchun.2' })],
              geometry: geometry,
              spatialQueryMode: ol.supermap.SpatialQueryMode.INTERSECT
            });

            new ol.supermap.QueryService(baseUrl).queryByGeometry(queryByGeometryParameters).then(function (serviceResult) {
              var features = new ol.format.GeoJSON().readFeatures(serviceResult.result.recordsets[0].features);
              var iconStyle = new ol.style.Style({
                image: new ol.style.Icon({
                  anchor: [0.5, 1],
                  src: '../img/marker-gold.png'
                })
              });
              for (var i = 0; i < features.length; i++) {
                features[i].setStyle(iconStyle);
              }
              var vectorSource = new ol.source.Vector({
                features: features
              });
              var resultLayer1 = new ol.layer.Vector({
                source: vectorSource
              });
              map.addLayer(resultLayer1);
            });
          });
      }
    </script>
  </body>
</html>
